<template>
	<div class="ruijie-main">
		<div class="ruijie-main-header-con">
			<div class="ruijie-main-header">
				<div class="logo">
					<img src="../assets/logo.png"/>
				</div>
				<Header></Header>
			</div>
		</div>
		<div class="ruijie-main-page">
			<router-view></router-view>
		</div>
		<transition  name="dialog-fade" >
		<div class="el-dialog__wrapper" style="z-index: 2062" v-if="guizeMo" @click.self="guizeMo=false">
			<div class="el-dialog guizemodel" style="width: 600px;margin-top: 60px">
				<div style="position: relative">
					<img src="../assets/images/guizeHeader.png" style="width: 100%"/>
					<i class="iconfont icon-gongxiangtuopaniconshangchuan-" @click="guizeMo=false"></i>
				</div>
				<div class="el-dialog__body">
					<p>暂无</p>
				</div>
			</div>
		</div>
		</transition>
		<transition  name="el-fade-in" >
			<div class="v-modal" style="z-index: 2061" v-if="guizeMo" ></div>
		</transition>
	</div>
</template>
<script type="es6">
import Header from './components/Header';
import eventBus from '../libs/eventBus';
import Reserve from './mixin/Reserve';
export default {
  mixins: [Reserve],
  data () {
    return {
      guizeMo: false,
      swiperIndex: 0,
      showSwiuper: false
    };
  },
  components: {
    Header
  },
  computed: {
  },
  methods: {
    slideChange () {
      this.swiperIndex = this.$refs.swiper.swiper.activeIndex;
    },
    swiperNext () {
      this.$refs.swiper.swiper.slideNext();
    },
    completeguide () {
      this.showSwiuper = false;
      if (!this.user.Behavior.First) {
        this.user.Behavior.First = true;
        this.behaviormodify(this.user.Behavior);
      }
    }
  },
  mounted () {
    eventBus.$on('showguizeMO', () => {
      this.guizeMo = true;
    });
  },
  destroyed () {
    eventBus.$off('showguizeMO');
  }
};
</script>
<style lang="less">
	@import "../styles/main.less";
	.ruijie-main-page {
		position: relative;
		top: 60px;
	}
</style>
